<template>
    <div class="list-wrapper  ">

        <div v-if="modelConf" class="list-top">
            <!--@dblclick.prevent.stop='showModal'-->
            <div class="panel-heading">
                <listTitle @showModal='showModal' @toctlFields='toctlFields' @doSearch='doSearch'
                           @setSearchDate='setSearchDate' @refresh='refresh' @toExport='toExport' v-if="modelConf"
                           :modelConf='modelConf' :list_fileds='list_fileds'>
                    <!--<h4 v-if="modelConf">{{modelConf.title + '列表'}} ({{total}})</h4>-->
                    <list_info v-if="modelConf" :title="modelConf.title" :ctl="ctl" :total="total" :money="money"></list_info>
                </listTitle>

            </div>

        </div>

        <fenye @changePage='changePage' :pages="pages" :page="page" class="float_fenye" :total="total"></fenye>
        <!--<ctlFields v-if="list_fileds" @toctlFields='toctlFields' class="float_ctlFields" :ctl="ctl" :list_fileds="list_fileds"></ctlFields>-->

        <p class="table_loading" v-if="loading_p_show">
            <loading :loadingShow="loadingShow"></loading>
        </p>
        <!--<table :class="cols" class="ui small column striped sortable selectable celled table fixed  collapsing ">-->
        <table v-if="hled_items.length>0" v-show="!loadingShow" :class="cols"
               class="ui table small celled striped sortable selectable">
            <thead v-if="firstLine" class="firstLine">
            <tr>
                <th>选择 <i title="全选/取消全选" @click="selectAll" class="ui icon icon-quanxuan1"
                          :class="{selectAll:isSelectAll}"></i></th>
                <template v-for=" head in firstLine">
                    <span v-show="false">{{_key = `${head.field}_${head.title}`}}</span>
                    <!--<span v-show="false">{{_show=(changeHideCol||useHideConf)?!columnShow[_key]:head.flag != 'HIDE'}}</span>-->
                    <span v-show="false">{{_show = !columnShow[_key]}}</span>
                    <span v-show="false">{{_display = !columnDisplay[_key]}}</span>
                    <span v-show="false">{{to_sort = sortConf&&sortConf.contains(head.field)}}</span>
                    <span v-show="false">{{cur_sort = (head.field==sort_column)}}</span>
                    <th :class="head.field" v-if="_show&&_display" @click="sortByColumn(`${head.field}#${head.title}`)">
                        {{head.title}} <i class="ui icon " v-if="to_sort&&head.title!='操作'" :class="{'arrow up cur':cur_sort&&sort_type[head.field]=='asc','arrow down cur':cur_sort&&sort_type[head.field]=='desc','arrow down':to_sort&&sort_type[head.field]!='asc'}" ></i><i class="ui icon remove" :_key="_key" title="隐藏该列"
                                          @click.stop="hideColumn(`${head.field}_${head.title}`)"></i>
                    </th>
                </template>
            </tr>
            </thead>
            <tbody>

            <tr v-for="line in hled_items" :class="{selected:selected.contains(line[0].rs)}" :style="line_style[line[0].rs]">
                <td>
                    <input class="lineChk" type="checkbox" v-model="selected" :value="line[0].rs"/>
                </td>
                <template v-for="col in line">
                    <span v-show="false">{{_key = `${col.field}_${col.title}`}}</span>
                    <!--<span v-show="false">{{_show=(changeHideCol||useHideConf)?!columnShow[_key]:col.flag != 'HIDE'}}</span>-->
                    <span v-show="false">{{_show = !columnShow[_key]}}</span>
                    <span v-show="false">{{_display = !columnDisplay[_key]}}</span>
                    <td :class="[{'single line':(col.rs&&col.rs.length<50)||col.btns}]" v-if="_show&&_display">
                        <mycell :cell_id="line[0].rs" :col="col" :ctl="ctl" :colorConf_hled="colorConf_hled?colorConf_hled[col.field]:null"></mycell>
                    </td>
                </template>
            </tr>
            </tbody>
        </table>

        <div v-if="hled_items.length==0&&!loadingShow" class="ui segment">
            <p v-if="is_search">没有数据</p>
            <p v-else>没有数据。<br>可能尚未配置访问权限，请联系管理员。</p>
        </div>

        <div class="ui  dimmer">
            <mydetail></mydetail>

        </div>


    </div>
</template>
<script>
    import loading from 'components/common/loading'
    import mycell from 'components/page/cell'
    import listTitle from 'components/common/listTitle';
    import fenye from 'components/common/fenye';
    import mydetail from 'components/page/detail'
    import ctlFields from 'components/list/ctlFields';
    import list_info from 'components/list/list_info';

    import tool from 'src/util/tool';
    import util from '_util/index';
    import logic from '_logic';
    import _ from 'lodash';

    var in_array = require('in_array');


    import {
        mapState,
        mapMutations,
        mapGetters,
        mapActions
    } from 'vuex'
    export default {
        data() {
            return {
                path: '',
                total: 0,
                money: 0,
                isnewCtl: true,
                isSelectAll: false,
                search_cleared: true,
                columnShow: {},
                columnDisplay: {},
                line_style: {},
                not_list_field_info: null,
                cell_btn_auths: null,
                changeHideCol: false,
                useHideConf: false,
                loading_p_show: false,
                searchVo: {},
                searchDate: {},
                page: 1,
                grids: [],
                selected: [],
                searchAll: null,
                colorConf: null,
                items: [],
                loadingShow: true,
                modalShow: false,
                sort_type: {
                  id:'desc'
                },
                sort_column: 'id',
                sort_column_title: 'ID',
                modalShow_menu_group: false,
                nolimit: false,
                sortConf: null
            }
        },
        filters: {
            colFilter(col) {

            }
        },
        methods: {
            selectAll(){
                this.isSelectAll = !this.isSelectAll;
                if (this.isSelectAll) {
                    let id_str = logic.list.hl_list_id(this);
                    this.selected = this.items.map((item) => {
                        return item.find(obj => {
                            return obj.field == id_str;
                        }).val;
                    })
                } else {
                    this.selected = [];
                }
            },
            getShow(_key, col){
                tool.cl(_key, col.falg);
                if (this.changeHideCol || this.useHideConf) {
                    return !this.columnShow[_key];
                } else {
                    return col.flag != 'HIDE';
                }
//        !columnShow[_key]||(!columnShow[_key]&&col.flag!='HIDE')
            },
            hideColumn(key){
                this.$set(this.columnShow, key, true);
            },
            sortByColumn(key){
                let [column,column_title] = key.split('#');
                let is_sort = this.sortConf && this.sortConf.contains(column);
                if(column_title=='操作'||!is_sort)
                  return;
                if(this.sort_column!=column) {
                    util.forEach(this.sort_type, (ind, val) => {
                        this.sort_type[ind] = 'desc';
                    });
                    this.sort_type[column]='asc';
                }
                this.sort_column=column;
                this.sort_column_title=column_title;

                this.loadingShow = true;

                this.getData('',false,true)
            },
            setColumnShow(hide_fields){
                this.columnShow = {};
                if (util.isArray(hide_fields)) {
                    hide_fields.map(item => {
                        this.$set(this.columnShow, item, true);
                    });
                }
            },
            setColumnDisplay(display_fields){
                this.columnDisplay = {};
                if (util.isArray(display_fields)) {
                    display_fields.map(item => {
                        this.$set(this.columnDisplay, item, true);
                    });
                }
            },
            toctlFields(hide_fields){
                this.setColumnShow(hide_fields)
                this.changeHideCol = true
            },
            setSearchDate(searchDate) {
                this.searchDate = searchDate
                this.setSearchAll()
            },
            toSearch(searchVo) {
                this.searchVo = searchVo
                this.setSearchAll();
                this.doSearch()
            },
            sort_back() {
                this.sort_column = 'id';
                this.sort_column_title = 'ID';
                this.sort_type[this.sort_column] = 'desc';
            },
            clearSearchVo() {
                this.page = 1;
                this.clearSearchVo_notsearch()
                this.setSearchAll()
                this.sort_back()
                this.doSearch()
            },
            clearSearchVo_notsearch() {
                this.searchVo = {};
                this.searchDate = {};
                this.search_cleared = true;
                this.setSearchAll();

            },
            getDetailById(id) {
                let obj = this.items.filter(item => {
                    return item[0].val == id;
                });
                if (obj)
                    util.store.saveResult(this, 'getDetailById', obj[0]);
            },
            store_list_selected() {
                util.store.push(this, 'set_selected_ids', 'selected_ids', this.ctl, this.selected, 'list');
            },
            get_not_list_field_info(id) {
                if (this.not_list_field_info) {
                    let obj = this.not_list_field_info[id];
                    if (obj)
                        util.store.saveResult(this, 'get_not_list_field_info', obj);
                }

            },
            doSearch() {
                this.page = 1;

                this.loadingShow = true;

                logic.list.saveParam(this);

                this.getData('doSearch')
            },
            showModal(flag) {

                let modal_search_mid = util.store.get(this, 'modal_search_mid');
                if (modal_search_mid && modal_search_mid != this.current_mid)
                    util.eventEmit(this, 'changeSearch', this.current_mid);

                let eventVue = util.store.get(this,'eventVue');
                eventVue.$emit('showSearchModal', flag)
            },

            trClick(event) {
                let target = event.target
                let id = $(target).closest('tr').find('input[type=checkbox]').val()
                let ind = this.selected.indexOf(id)
                if (ind != -1) {
                    this.selected.remove(id)
                } else
                    this.selected.add(id)

            },
            changePage(page) {
                if (this.page != page) {
                    this.page = page
                    this.loadingShow = true;
                    this.getData('changePage:176')
                }
                //        tool.cl('page:', page)
            },
            refresh(rebuild=false) {

                this.loadingShow = true
                this.getData('refresh:181')
            },
            toExport() {
                this.getData('toExport:217', true);
            },
            detail(id) {
                tool.cl(id)
            },
            edit(id) {
                tool.cl(id)
            },
            forbidCom(id){

                let ctl = this.$store.state.global.current_ctl
                //请求url
                let op = 'forbid';
                let pre = 'index'
                if (in_array(ctl, this.$store.state.global.module_permission.changeApi)) {
                    pre = 'user'
                    op = 'forbid'

                }

                let url = tool.getApi(this, ctl, op, pre);
                let param = {id: id}
                this.$http.post(url, param).then((rs) => {

                    let obj = rs.data
                    this.msgShow = true
                    if (obj.status == tool.RS_OK) {
                        this.msgType = 'success';
                        this.msg = '操作成功!';
                        //            this.vo = {}
                        //this.rmData(id);
                        this.updateState(id);//更改状态
                    } else {
                        this.msg = obj.msg;
                    }
                    setTimeout(() => {
                        this.msgShow = false
                        setTimeout(() => {
                            this.msgType = 'error'
                        }, 500);

                    }, 1000);

                });


            },
            delCom(id) {
                let ctl = this.$store.state.global.current_ctl;
                //修改请求url

                let op = 'del';

                let pre = 'index'
//                if (in_array(ctl, this.$store.state.global.module_permission.changeApi)) {
//                    pre = 'user'
//                    op = 'remove'
//
//                }

                let url = tool.getApi(this, ctl, op, pre);
                let _id = id == 'batch' ? this.selected : id;
                let param = {
                    id: _id
                };
                util.http.SR(this, url, param, '删除成功', (rs) => {
                    this.rmData(_id);
                });
            },
            set_line_style(cell_id,style) {
              this.line_style[cell_id]=style;
            },
            onOff(flag,_id=null) {
                if (this.selected.length > 0||_id) {

                    let url = tool.getApi(this, this.ctl, 'set');
                    let param = {
                        type: 'onOff',
                        field: logic.list.get_onOff_field(this),
                        flag: logic.list.get_onOff_val(this, flag),
                        ids: _id?[_id]:this.selected,
                    };
                    util.http.SR(this, url, param, '操作成功', (rs) => {
                        logic.list.refreshListData(this);
                    });

                }

            },
            logout() {
                this.$parent.user = {}
            },
            rmData(id) {
                let ids = [];
                if (!util.isArray(id)) {
                    ids.push(id);
                } else {
                    ids = id;
                }
                ids.forEach(id => {
                    let item = this.items.find(t => {
                        return t[0].title == 'ID' && t[0].val == id;
                    });
                    this.items.remove(item);
                });

            },
            //更改状态
            updateState(id){

                let item = this.items.find(t => {
                    return t[0].title == 'ID' && t[0].val == id
                });

                let itemc = item.find(t => {
                    return t['field'] == 'status'
                });


                if (itemc.rs == '禁止') {
                    itemc.rs = '正常'
                } else {
                    itemc.rs = '禁止'
                }

            },
            appendData(item) {
                this.items.add(item);
            },
            updateData(item) {
                this.rmData(item.id)
                this.appendData(item);
            },
            freshData(item) {
                let op = this.$store.state.global.op || 'insert';
                if (op == 'update') {
                    this.updateData(item)
                } else {
                    this.appendData(item);
                }
            },
            columnShowInit() {
                let isnewCtl = this.isnewCtl;
                this.isnewCtl = false;

                let store_hide_fields = util.store.get(this, `hideFields.${this.ctl}`, 'list') || '';
                if (store_hide_fields && Object.keys(store_hide_fields).length > 0) {
                    this.setColumnShow(store_hide_fields);
                    this.useHideConf = true;
                } else if (!this.changeHideCol) {
//          this.columnShow=
                    if (isnewCtl) {
                        this.columnShow = {};
                        this.columnDisplay = {};
                    }
                    if (Object.keys(this.columnShow).length == 0) {


                        let url = tool.getApi(this, 'Listget', 'getListHide');
                        let param = {
                            model: this.ctl
                        };
                        util.getDataCom(this, url, param, (rs) => {
                            if (rs) {
                                if (rs != -1) {
                                    let hide_fields = rs.split(',');
                                    this.setColumnShow(hide_fields);
                                }
                                this.useHideConf = true;
                            } else {
                                this.hlFieldHide();
                            }

                        });
                    }

                }

            },
            hlFieldDisplay(){
                let displayFields = [];
                if (this.firstLine)
                    displayFields = this.firstLine.filter(field => {
                        return field.flag == 'DISPLAY';
                    });

                if (displayFields && displayFields.length > 0) {

                    let display_fields = displayFields.map(field => {
                        return `${field.field}_${field.title}`;
                    });
                    this.setColumnDisplay(display_fields);

                } else {
                    this.setColumnDisplay([]);
                }
            },
            hlFieldHide(){
                let hideFields = [];
                if (this.firstLine)
                    hideFields = this.firstLine.filter(field => {
                        return field.flag == 'HIDE';
                    });
                if (hideFields && hideFields.length > 0) {

                    let hide_fields = hideFields.map(field => {
                        return `${field.field}_${field.title}`;
                    });
                    this.setColumnShow(hide_fields);

                } else {
                    this.setColumnShow([]);
                }

            },
            setSearchAll() {
                let searchVo = _.merge({}, this.searchDate, this.searchVo);
                if (searchVo) {
                    for (let key in searchVo) {
                        if (!searchVo[key])
                            delete searchVo[key]
                    }
                }
                if (Object.keys(searchVo).length > 0) {
                    searchVo.is_search = 1;
                    searchVo.isSearch = 1;
                }

                this.searchAll = searchVo;
            },
            async getData(from, is_export = false, is_sort = false) {
                if(logic.list.need_rebuild(this)) {
                    this.items = [];
                }

                let url = tool.getApi(this, this.ctl)
                let id = this.$route.query.id;
                let searchVo = util.deepCopy(this.searchAll)
                let param = searchVo || {}


                //参数记录
                logic.list.rememberParam(this, param);


                if (id) {
                    param.id = id;
                }
                param.p = this.page;
                param.length = tool.ROW_NUM;
//                param.sort = `${this.sort_column} ${this.sort_type}`;
                if(is_sort) {
                    param._order = this.sort_type[this.sort_column] == 'desc' ?'asc' : 'desc';
                    param._field = this.sort_column;
                }


                if (is_export) {
                    let selected_ids = util.store.get(this, `selected_ids.${this.ctl}`, 'list');
                    param.is_export = 1;
                    if(selected_ids&&selected_ids.length>0)
                        param.ids = selected_ids.join(',');
                }


                //添加区域控制
                if (this.$store.state.global.cityAll || util.is_admin(this)) {
                    //没有限制
                } else {

                    if (in_array(this.ctl, ['Trodetail','Product','TopProduct'])) {//添加城市列表
//                        let _this = this
//
//                        //await 同步执行
//                        await  _this.$store.dispatch('initUserCitys')
//                        if (this.$store.state.global.cityCodeLists) {
//                            param.city_codes = this.$store.state.global.cityCodeLists
//                        }
//                        let b = in_array(this.ctl, ['Product', 'TopProduct']);
                        let b = in_array(this.ctl, []);
                        let citys = util.modelFn('Auth', 'get_user_citys', this);
//                        tool.cl('citys:', citys);
                        if(citys&&citys!=-1) {
                          if(b)
                            param.city_code = citys;
                          else{
                              param.city_codes = citys;
                          }
                        }else if(!citys){
                            this.items = [];
                            this.loadingShow = false;
                            return;
                        }


                    }

                }

                //针对模型添加参数支持
                logic.list.addParam(this, param);
                this.loadingShow = true;
                this.items = [];
                //await 同步执行
                await util.getDataCom(this, url, param, (rs) => {
                    this.selected = [];
//                    this.searchAll_after = param;
                    if (is_export) {
                        util.showMsg(this, 'success', '导出任务创建成功!');
                        return;
                    }



                    this.items = rs.lines;
                    logic.list.save_list_data(this);

                    if(!this.is_admin) {
                        logic.list.hlCellBtnAuth(this);
                    }
                    this.not_list_field_info = rs.not_list_field_info;
                    util.store.commit(this,'setCurrent_fields', rs.fields);
                    util.store.commit(this,'setCurrent_names', rs.names);
                    this.total = rs.total;
                    this.money = rs.money;
                    this.sortConf = rs.sortConf||['id'];
                    this.colorConf = rs.colorConf;

                    if(param.is_search==1&&['Trodetail','Trosp','Refundorders'].contains(this.ctl)) {
                        this.sort_back();
                        this.sortConf =null;
                    }

                    if(rs.auth_changed) {
                        util.modelFn('Auth', 'set_user_auth',this);
                    }

                    this.loadingShow = false;
                    this.$data.nolimit = false;
                    util.store.push(this, 'setPage', 'pageData.total', this.ctl, this.total, 'list');
                    this.columnShowInit();
                    this.hlFieldDisplay();
                    if(is_sort)
                        this.sort_type[this.sort_column] = param._order;
                }, (data, msg) => {

                    if (msg == '权限不足') {
                        this.$data.nolimit = true
                    } else {
                        this.$data.nolimit = false
                    }
                    this.items = [];
                    msg = data && (data.errmsg || data.debug) ? `${data.errmsg}(${data.debug})` : msg;
                    util.showMsg(this, 'error', msg);
                    this.loadingShow = false;
                });


            },
            ...mapMutations({
                getModel:'global/getModel'
            }),
        },
        watch: {
            page: function (val, old) {
              if(val) {
                  util.store.push(this, 'set_current_page', 'current_page', this.ctl, this.page, 'list');
              }

            },
            to_p: function (val, old) {
              if(val&&val!=old) {
                  this.changePage(val);
              }

            },
            selected: function (val, old) {
                this.store_list_selected();
            },
            loadingShow: function (val, old) {
                if (val) {
//          $(".ui.table").fixMe();
                }
            },
            columnShow: function (val, old) {
                let hideFields = Object.keys(val);
                util.store.push(this, 'setHideFields', 'hideFields', this.ctl, hideFields, 'list');
            },
            ctl: function (val, old) {
                if (val != old) {
                    //this.$cookie.delete('lastctl');
                    this.$cookie.set('lastctl', val);
                    this.search_cleared = false;
                    this.line_style = {};
//                    this.items = [];
//        tool.cl('in list change')
                    util.setCtlinfo(this);

                    util.store.commit(this,'setEditVo', {});

                    let eventVue = util.store.get(this,'eventVue');
                    eventVue.$emit('changeSearch')

                    this.loadingShow = true
                    this.isnewCtl = true;
                    this.selected = [];

                    this.sort_back();
                    this.page = 1
                    eventVue.$emit('clearListSearch');


                }
            },
            query: function (val, old) {
                if (val != old) {
                    this.loadingShow = true

                    this.changeHideCol = false;
                    this.isSelectAll = false;


                    let interval = window.setInterval(() => {
                        if (this.search_cleared) {
                            this.getData('query:392');
                            window.clearInterval(interval);
                        }
                    }, 100);


                }
            },
//            colorConf: function (val, old) {
//                if (val) {
//                    logic.list.save_colorConf(this,val);
//                }
//            },
            is_detail: function (val, old) {
                if (val) {
                    $('.list-wrapper').dimmer({
                        closable: false
                    });
                    $('.list-wrapper').dimmer('show');
                } else {
                    $('.list-wrapper').dimmer('hide');
                }
            }
        },
        computed: {
            colorConf_hled(){
                return logic.list.save_colorConf(this,this.colorConf);
            },
            is_search(){
                let filterData = util.store.get(this, `filterData.${this.ctl}`, 'list');
                return filterData?filterData.is_search:false;
            },
            is_admin(){
                return util.is_admin(this);
            },
            pages() {
                let row = tool.ROW_NUM
                let pages = 0
                if (this.total % row == 0) {
                    pages = this.total / row
                } else
                    pages = Math.floor(this.total / row) + 1
                return pages
            },

            ctl() {
                return this.$route.query.ctl;
            },
            to_p() {
                return this.$route.query.to_p;
            },
            modal_type() {
                let type = ''
                switch (this.ctl) {
                    case 'Menu':
                        type = 'menu_group'
                        break;
                    default:
                        type = 'search'
                }
                return type
            },
            query() {
                return this.$route.query;
            },
            cols() {
                let fline = this.firstLine || {}
                let cols = fline.length;
                return tool.n2e(cols)
            },
            hled_items() {
                let auths = util.store.get(this, 'auth_ctls', 'user');
                return this.items.map(line=> {
                    return line.map(col => {
                        col.auths=auths;
                        col.is_admin=this.is_admin;
                        return col;
                    });
                })
            },
            firstLine() {
                return this.items[0];
            },
            list_fileds() {
                if (!this.firstLine)
                    return null;
                return this.firstLine.map((col, ind) => {
                    let _key = `${col.field}_${col.title}`;
                    return {
                        id: _key, title: col.title
                    }
                });
            },
            modelConf() {
                this.getModel(1);
                let model = this.vuexRs
                return model;
            },
            is_detail() {
                return this.$store.state.global.is_detail
            },
            ...mapState({
                vuexRs:state=>state.global.vuexRs
            })
        },
        components: {
            loading,
            mycell,
            fenye,
            ctlFields,
            list_info,
            mydetail,
            listTitle
        },
        props: ['menus', 'user'],
        created() {
            this.page = this.to_p || 1;
            util.store.push(this, 'set_current_page', 'current_page', this.ctl, this.page, 'list');

            if (this.$route.query.ctl) {
                this.$cookie.set('lastctl', this.$route.query.ctl);
            }


            this.path = this.$route.path
            util.setCtlinfo(this);
            this.getData('created:474');

            let eventVue = util.store.get(this,'eventVue');
            eventVue.$on('delCom', this.delCom)
            eventVue.$on('forbidCom', this.forbidCom)
            eventVue.$on('refreshData', this.refresh)
            eventVue.$on('doSearch', this.toSearch)
            eventVue.$on('clearSearchVo', this.clearSearchVo)
            eventVue.$on('clearSearchVo_notsearch', this.clearSearchVo_notsearch)
            eventVue.$on('getDetailById', this.getDetailById)
            eventVue.$on('get_not_list_field_info', this.get_not_list_field_info)
            eventVue.$on('onOff', this.onOff)
            eventVue.$on('set_line_style', this.set_line_style)


            eventVue.$emit('changeSearch')//搜索筛选项
        },
        mounted() {
            //      $('.list-wrapper').dimmer('show');
            this.loading_p_show=true;
        },
        destroyed() {
            /**
             *  实例销毁前调用
             * */
            let eventVue = util.store.get(this,'eventVue');
            eventVue.$off('delCom', this.delCom);
            eventVue.$off('forbidCom', this.forbidCom);
            eventVue.$off('refreshData', this.refresh);
            eventVue.$off('doSearch', this.toSearch);
            eventVue.$off('clearSearchVo', this.clearSearchVo);
            eventVue.$off('clearSearchVo_notsearch', this.clearSearchVo_notsearch);
        }
    }
</script>
<style rel="stylesheet/less" scoped lang="less">@import "../../common/style/mixin";

@dir: "common/";

.list-wrapper {
    .ui.striped.table tbody tr:nth-child(2n), .ui.striped.table>tr:nth-child(2n) {
        &.selected{
            background-color: rgba(33, 133, 208,0.3);
        }
        background-color: rgba(0,0,50,.02);
    }
    tr.selected{
        background-color: rgba(33, 133, 208,0.3);
    }
    .ui.table thead th {
        position: relative;
        padding-right: 1.5em;
        i.icon-quanxuan1 {
            color: rgba(0, 0, 0, 0.6);
            &:hover {
                color: rgba(0, 0, 0, 1);
            }
            &.selectAll {
                color: rgba(33, 133, 208, 0.6);
                &:hover {
                    color: rgba(33, 133, 208, 1);
                }
            }
        }
        .ui.icon.arrow {
            cursor: pointer;
            color: rgba(0, 0, 0, 0.2);
            &.cur{
                color: rgba(0, 0, 0, 0.6);
            }
            &:hover {
                color: rgba(0, 0, 0, 0.9);
            }
        }
        .ui.icon.remove {
            position: absolute;
            right: -1px;
            top: 0px;
            cursor: pointer;
            color: rgba(0, 0, 0, 0.3);
            &:hover {
                color: rgba(0, 0, 0, 0.5);
            }
        }
    }
    .list-top {
        .main-position();
        margin: 0px 10px;
        z-index: 1001;

        border: 1px solid #ddd;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;

        box-shadow: 0 1px 1px rgba(0, 0, 0, .05);

        padding: 10px 15px;
        color: #333;
        background-color: #f5f5f5;

    }
    .float_ctlFields {
        .main-right-bottom();
        right: auto;
        left: 25px;
        z-index: 1001;
    }
    .float_fenye {
        .main-right-bottom();
        z-index: 1001;
    }
    .table_loading {
        .under-main-position();
    }
    .ui.table {
        &.table-header-fixed {
            top: 102px;
            position: fixed;
            width: auto;
            display: none;
            /*border:none;*/
        }
        margin-bottom: 70px;
        .under-main-position();
        tr {
            th {
                white-space: nowrap;
            }
        }

    }
}

.hideAll {
    .list-wrapper {
        .list-top {
            .main-position-hideAll();
        }
        .ui.table, .table_loading {
            margin: 102px 10px 60px 10px;
        }
    }
}

</style>
